<template>
  <el-form ref="basicInfoForm" :model="infoForm" :rules="rules" label-width="150px">
    <el-row>
      <el-col :span="24">
        <el-form-item label="爬虫名称" prop="crawlName">
          <el-input v-model="infoForm.crawlName" placeholder="请输入爬虫名称" />
        </el-form-item>
      </el-col>
      <el-col :span="24">
        <el-form-item label="爬虫地址" prop="crawlUrl">
          <el-input v-model="infoForm.crawlUrl" placeholder="请输入爬虫地址" />
        </el-form-item>
      </el-col>
      <el-col :span="24">
        <el-form-item label="爬虫类型" prop="crawlType">
          <el-select v-model="infoForm.crawlType" placeholder="请选择" clearable>
            <el-option v-for="dict in crawl_source_config_crawl_type" :key="dict.value" :label="dict.label" :value="dict.value" />
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="24">
        <el-form-item label="是否启用" prop="crawlEnabled">
          <el-select v-model="infoForm.crawlEnabled" placeholder="请选择" clearable>
            <el-option v-for="dict in crawl_source_config_crawl_enabled" :key="dict.value" :label="dict.label" :value="dict.value" />
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="24">
        <el-form-item label="备注" prop="crawlRemark">
          <el-input v-model="infoForm.crawlRemark" type="textarea" :rows="3"></el-input>
        </el-form-item>
      </el-col>
    </el-row>
  </el-form>
</template>

<script setup lang="ts">
import { propTypes } from '@/utils/propTypes';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;

const prop = defineProps({
  info: propTypes.any.def({})
});

const infoForm = computed(() => prop.info);
const { crawl_source_config_crawl_type, crawl_source_config_crawl_enabled } = toRefs<any>(
  proxy?.useDict('crawl_source_config_crawl_type', 'crawl_source_config_crawl_enabled')
);

// 表单校验
const rules = ref({
  crawlName: [{ required: true, message: '请输入爬虫名称', trigger: 'blur' }],
  crawlUrl: [{ required: true, message: '请输入爬虫地址', trigger: 'blur' }],
  crawlType: [{ required: true, message: '请选择爬虫类型', trigger: 'blur' }],
  crawlEnabled: [{ required: true, message: '请选择是否启用', trigger: 'blur' }],
});
</script>
